<template>
	<div class="list-content">
		<div  v-for="item of datas">
		<router-link :to="'/chatRoom/'+item.name">
		<div class="list-left"><img :src="item.imgUrl" class="list-logo"></div>
		<div class="list-right" >
			<div class="main-title" >{{item.name}}<span class="title-time">昨天</span></div>
			<div class="sub-title">{{item.subMain}}</div>
		</div>
		</router-link>
		</div>
	</div>
</template>

<script type="text/javascript">
	export default {
		props:{
			homes:Object
		},
		data(){
			return {
				datas:{}
			}
		},
		methods:{
			getContentData(){
				this.$a.get('/api/index.json').then(this.getPlay,err=>{
					alert('获取失败')
				})
			},
			getPlay (res){
					res=res.data
					if(res.ret && res.data){
						console.log('接受成功')
						const home=res.data.home
						this.datas=home.contentData
					}
				}
		},
		mounted(){
			this.getContentData();
		}
	}
</script>

<style type="text/css" lang="stylus" scoped>
	.list-content
		height:1.2rem
		.list-left
			height: 1.2rem;
			width: 20%;
			float:left
			.list-logo
				height:80%
				border-radius:50%
				margin:.15rem .2rem
		.list-right
			float:left
			width:80%
			height:1.2rem
			.main-title
				margin-top: 12px;
				margin-bottom: 5px;
				font-size: 16px;
				font-weight: 600;
				color:#050819;
				.title-time
					font-size: 13px;
					float: right;
					margin-right: 14px;
					color: #bbb;
					font-weight: 500;
			.sub-title
				color: #999;
				font-size: 15px;
</style>